<template>
    <a-table
        :data-source="products"
        rowKey="_id"
        :pagination="pagination"
        @change="change"
    >
        <a-table-column key="name" title="商品名" data-index="name" />
        <a-table-column key="price" title="价格" data-index="gender" />
        <a-table-column key="action" title="操作">
            <template slot-scope="text, record">
                <span>
                    <a-button @click="get(record._id)">修改</a-button>
                    <a-divider type="vertical" />
                    <a-button type="danger" @click="del(record._id)"
                        >删除</a-button
                    >
                </span>
            </template>
        </a-table-column>
    </a-table>
</template>

<script>
// import { getById } from "../../services/product";
import {mapActions, mapMutations} from 'vuex'
export default {
    props: ["products", "pagination"],
    methods: {
        ...mapMutations('product',['setVisible']),
        ...mapActions('product',['showById']),
        change(pagination) {
            this.$emit("show", pagination.current, pagination.pageSize);
        },
        async get(id){
            this.setVisible(true);
            this.showById(id);
            // this.$emit("setStudent",student);
            // this.$emit("setVisible",true);
            // this.setVisible(true);
            // this.showById(id);

        },
        del(id) {

            this.$confirm({
                title: "Do you want to delete these items?",
                content:
                    "When clicked the OK button, this dialog will be closed after 1 second",
                onOk: () => {
                    // del(id);
                    this.$emit("show");
                },
            });
        },
    },
};
</script>

<style>
</style>